<div id="editor-styles">
<style>
#style-categories {padding:0 0;margin: 0;text-align: center;}
#style-categories .active{color:red;}
#style-categories > li {list-style: none;display:inline-block;padding: 0 6px;}
#style-categories > li > a:hover, #style-categories > li > a:focus{text-decoration: none;background-color: #eeeeee;}
#style-categories ul.dropdown-menu li {list-style: none;display:block;padding: 0;}
#style-overflow-list ul li {cursor: pointer;padding: 10px 10px;border-bottom: 1px solid #ddd;}
#style-overflow-list ul li:hover {background: #FFF;}
#editor-styles {max-width:500px;}
#editor-styles ul {margin:0 0;}
#editor-styles * {font-family:"Helvetica Neue",Helvetica,"Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;font-size: 14px;}
#editor-styles * {max-width: 100%!important;margin:0;padding:0;font-style:normal;box-sizing: border-box!important;-webkit-box-sizing: border-box!important;word-wrap: break-word!important;}
#editor-styles p{clear:both;margin:0 0;font-size:14px;min-height:1em;white-space: normal;}
#editor-styles img{*zoom:1;max-width:100%;*max-width:96%;height:auto !important;}
#editor-styles iframe{width:301px !important;border:0;background-color:none;}
#editor-styles iframe,#editor-styles .video_iframe {background-color: #000000;width: 100% !important;position: static;}
#editor-styles blockquote{margin:0;padding-left:10px;border-left:3px solid #DBDBDB;}
.filter {cursor: pointer;display: inline-block;}
#editor-styles .pagelink{margin: 10px 0;}
#editor-styles .pagelink span,#editor-styles .pagelink a{padding:0 3px;}
.dropdown { position: relative;}
.dropdown-menu {position: absolute;top: 100%;left: 0;z-index: 1000;display: none;float: left;min-width: 160px;padding: 5px 0;margin: 2px 0 0;list-style: none;font-size: 14px;text-align: left;background-color: #ffffff;border: 1px solid #cccccc; border: 1px solid rgba(0, 0, 0, 0.15);  border-radius: 0px;  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);  background-clip: padding-box;}
.open > .dropdown-menu {  display: block;}
.dropdown-menu > li > a { display: block;padding: 5px 15px !important;clear: both;font-weight: normal;line-height: 1.42857143;color: #333333;white-space: nowrap;}
.dropdown-menu > li > a:hover,.dropdown-menu > li > a.active,.dropdown-menu > li > a:focus { text-decoration: none;  color: #ffffff;  background-color: #2fa4e7;}
.dropdown-menu > .active > a,.dropdown-menu > .active > a:hover,.dropdown-menu > .active > a:focus { color: #ffffff; text-decoration: none;outline: 0;background-color: #2fa4e7;}
</style>
<link rel="stylesheet" type="text/css" href="//static.135editor.com/fonts/icon135/iconfont.css" />

	<div  id="copyright" style="line-height:40px;">
          	<div style="height:30px;line-height:30px;padding:0 10px;color: #555; background-color:rgba(76, 67, 66,0.2);background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);">
          		<img src="http://image.135editor.com/logot.png" title="135编辑器" alt="135编辑器" style="height:14px !important;"> <span style="font-size:12px;">VIP专享</span>
          		<!-- <input type="text" placeholder="输入关键字搜索样式" style="height:30px;width:240px;color: #FFF;background-color: transparent; border: 0 none; padding:0 10px;" id="txtStyleSearch"> 
          		<span style="cursor:pointer;float:right;margin-right:20px;" onclick="reloadStyleOperate();" data-toggle="tooltip" data-container="body" data-placement="bottom" title="刷新样式"><i class="fa fa-refresh"></i></span>
          		 -->
          	</div>
          	<div id="styleSearchResult" style="position:absolute;display:none;top:40px;left:80px;padding:10px;width:384px;z-index: 100;border: 5px solid rgba(80,80,80,0.2);background:#FFF;">
          		<p>搜索结果 <span class="btn" style="float:right;font-size: 24px;    color: #000000;font-weight: bold;text-shadow: 0 1px 0 #ffffff;" onclick="$('#styleSearchResult').hide();"> × </span> </p>
          		<div id="styleSearchResultList" style="height:500px;width:100%;overflow-y:auto;">
          			<img src="//static.135editor.com/img/ajax/circle_ball.gif">
          		</div>
          	</div>
	 </div>
	 <div style="background-color:rgba(234,234,234,0.9);height:44px;padding:2px;{{if $appinfo['Appkey']['show_icon']}}line-height: 20px;{{else}}line-height: 40px;{{/if}}text-align:center;">
          	{{template editor_styles/style_categories}}
	  </div>
	  <div id="style-overflow-list" style="overflow-y:auto;overflow-x:hidden;height:300px;background-color: #fcfcfc;">
		{{if empty($company_user_id)&&empty($current_user_id) }}

		{{if $expired && !empty($appinfo)}}
					<section style="padding:10px 20px;border-bottom:1px solid #ddd;"><p style=" color:red;font-size: 16px;">使用的135编辑器插件已过期，功能被锁定。请管理员联系QQ285694665续期。</p></section>
			{{elseif empty($appinfo) || empty($userinfo)}}
				<section style="padding:10px 20px;border-bottom:1px solid #ddd;"><p style=" color:red;font-size: 16px;">使用的135编辑器插件体验版，请管理员联系QQ285694665获取正式授权，解锁更多功能。</p></section>
			{{/if}}
					<ul  class="editor-template-list ui-portlet-list anony"  style="padding-top: 5px;">
											  			
					  		<portlet  cache="900" ulclass="editor-template-list" portlet="body" list_tpl="inner" limit="3" model="EditorStyle" order="recommend desc,click_nums desc" info="recursive=1&fields[]=summary&fields[]=origin&fields[]=content&fields[]=name&fields[]=support_brush&fields[]=id&conditions[cate_id]=1&conditions[status]=1&conditions[recommend]=1">
								<li {{if $item['summary']}} data-content="{{str_replace('"','',$item['summary'])}}" data-title="{{$item['name']}}" data-trigger="hover" data-placement="right" data-container="body" data-toggle="popover"{{else}}  title="{{$item['name']}}" {{/if}}
								class="recomment-style {{if $key%2==1}}itembg2{{/if}} {{if $item['cate_id'] > 49}} cate-{{$item['cate_id']}} {{/if}}  col-xs-12 tag-recommend {{loop $item_all['Tag'] $tag}} tagtpl-{{$tag['id']}} {{/loop}}" data-id="{{$item['id']}}">
									<section class="135editor"  data-id="{{$item['id']}}">{{$item['content']}}<section style="display: block; width: 0; height: 0; clear: both;"></section></section>
								</li>
							</portlet>
							<li>付费插件显示更多样式</li>
					</ul>
		{{else}}
			  			
			<div class="ui-portlet clearfix ">
				<ul  class="editor-template-list ui-portlet-list" style="padding: 5px;">
				<?php $subfix = $current_user_id % 256;  ?>	
			<?php  $fav_ids = array(); $favor_pages = ''; $style_count = 0; ?>
			  
			  {{if $current_user_id}}
		  			<portlet  cache="no" ulclass="editor-template-list" portlet="body" list_tpl="inner"
		  			 limit="1000"
					 model="EditorStyle" order="Favorite.updated desc"
					 info="recursive=1&joins[0][table]=favorites_$subfix&joins[0][alias]=Favorite&joins[0][type]=inner&joins[0][conditions][Favorite.model]=EditorStyle&joins[0][conditions][]=Favorite.data_id=EditorStyle.id&conditions[EditorStyle.cate_id %3C%3E]=3&conditions[]=Favorite.creator_id=$current_user_id&fields[]=support_brush&fields[]=cate_id&fields[]=summary&fields[]=origin&fields[]=Favorite.id&fields[]=Favorite.click_nums&fields[]=Favorite.updated&fields[]=content&fields[]=EditorStyle.cover_width&fields[]=EditorStyle.name&fields[]=EditorStyle.id&fields[]=EditorStyle.coverimg&fields[]=EditorStyle.brush_image">
						
					  <?php  $fav_ids[] = $item['id']; if($item['brush_image']) continue;?>
							<li  style="position:relative;" data-click="{{$item_all['Favorite']['click_nums']}}" data-time="{{strtotime($item_all['Favorite']['updated'])}}"
		{{if $item['summary']}} data-content="{{str_replace('"','',$item['summary'])}}" data-title="{{$item['name']}}" data-trigger="hover" data-placement="right" data-container="body" data-toggle="popover"{{else}}  title="{{$item['name']}}" {{/if}}
		class="fav-style col-xs-12 {{if $item['cate_id'] > 49}} cate-{{$item['cate_id']}} {{/if}}  {{loop $item_all['Tag'] $tag}}  tagtpl-{{$tag['id']}} {{/loop}}" data-id="{{$item['id']}}">
							
								
							{{if $item['cate_id'] > 49}}
								{{if $item['cover_width']}}
									<section class="135editor" data-tools="135编辑器" data-id="{{$item['id']}}"><section style="text-align:center;"><section style="display:inline-block;width:{{$item['cover_width']}}px;"><img data-id="{{$item['id']}}" data-role="guide-img" style="max-width:100%;width:{{$item['cover_width']}}px;" title="{{$item['name']}}" src="{{$item['coverimg']}}" /></section></section></section>
								{{else}}
									<section class="135editor" data-tools="135编辑器" data-id="{{$item['id']}}"><p style="text-align:center;"><img data-id="{{$item['id']}}" data-role="guide-img" title="{{$item['name']}}" src="{{$item['coverimg']}}" /></p></section>
								{{/if}}								
							{{else}}
								<section class="135editor" data-tools="135编辑器" data-id="{{$item['id']}}">{{$item['content']}}</section>
							{{/if}}
							</li>
					</portlet>
					<?php $style_count += $count; ?>
				{{/if}}
				
				{{if $company_user_id}}
				<?php $subfix = $company_user_id % 256;  ?>	
			  	<portlet  cache="no" ulclass="editor-template-list" portlet="body" list_tpl="inner"
		  			 limit="1000"
					 model="EditorStyle" order="Favorite.updated desc"
					 info="recursive=1&joins[0][table]=favorites_$subfix&joins[0][alias]=Favorite&joins[0][type]=inner&joins[0][conditions][Favorite.model]=EditorStyle&joins[0][conditions][]=Favorite.data_id=EditorStyle.id&conditions[OR][EditorStyle.cate_id]=1&conditions[OR][EditorStyle.cate_id %3E]=49&conditions[]=Favorite.creator_id=$company_user_id&fields[]=support_brush&fields[]=cate_id&fields[]=summary&fields[]=origin&fields[]=Favorite.id&fields[]=Favorite.click_nums&fields[]=Favorite.updated&fields[]=content&fields[]=EditorStyle.cover_width&fields[]=EditorStyle.name&fields[]=EditorStyle.id&fields[]=EditorStyle.coverimg&fields[]=EditorStyle.brush_image">
						
					  <?php  if(in_array($item['id'],$fav_ids)) continue; if($item['brush_image']) continue;?>
							<li  style="position:relative;" data-click="{{$item_all['Favorite']['click_nums']}}" data-time="{{strtotime($item_all['Favorite']['updated'])}}"
		{{if $item['summary']}} data-content="{{str_replace('"','',$item['summary'])}}" data-title="{{$item['name']}}" data-trigger="hover" data-placement="right" data-container="body" data-toggle="popover"{{else}}  title="{{$item['name']}}" {{/if}}
		class="fav-style col-xs-12 {{if $item['cate_id'] > 49}} cate-{{$item['cate_id']}} {{/if}}  {{loop $item_all['Tag'] $tag}}  tagtpl-{{$tag['id']}} {{/loop}}" data-id="{{$item['id']}}">
							{{if $item['cate_id'] > 49}}
								{{if $item['cover_width']}}
									<section class="135editor" data-tools="135编辑器" data-id="{{$item['id']}}"><section style="text-align:center;"><section style="display:inline-block;width:{{$item['cover_width']}}px;"><img data-id="{{$item['id']}}" style="max-width:100%;width:{{$item['cover_width']}}px;" title="{{$item['name']}}" src="{{$item['coverimg']}}" /></section></section></section>
								{{else}}
									<section class="135editor" data-tools="135编辑器" data-id="{{$item['id']}}"><p style="text-align:center;"><img data-id="{{$item['id']}}" title="{{$item['name']}}" src="{{$item['coverimg']}}" /></p></section>
								{{/if}}
							{{else}}
								<section class="135editor" data-tools="135编辑器" data-id="{{$item['id']}}">{{$item['content']}}</section>
							{{/if}}
							</li>
					</portlet>
			  	<?php $style_count += $count; ?>
			  {{/if}}
			  
				{{if empty($style_count)}}							
				<li><p>请前往<a href="http://www.135editor.com/style-center?cate_id=1">135网站样式中心</a>收藏您需要用到的样式</p>	</li>					
				{{/if}}
				</ul>
			</div>		
		{{/if}}
	</div>
</div>

<section id="color-plan" style="width:110px;position:fixed;top:105px;right:-5px;height:320px;text-align: center;display:none;z-index: 1000;">
	<div id="color-choosen" style="position:absolute;right:0px;padding: 10px 0px !important;width:105px;padding:5px 0;background:rgba(58,51,50,0.8);">		
			  	<div style="margin:5px 5px;color:#FFF;line-height:32px;text-align: center;position:relative;" >
		        	<input id="custom-color-text" class="colorPicker form-control" style="font-size:12px;width:80px;color:#FFF;padding:4px;height:24px;line-height:16px" id="custom-color" value="#EF7060" />
		        </div>
		        
		        <div style="margin:0 0;color:#dad9d8;line-height:18px;text-align: center;"><label style="cursor:pointer;margin-bottom:0px;"><input style="margin-top:8px;" type="checkbox" id="replace-color-all" value="1"> 全文换色</label></div>

			 	<hr style="margin:2px 20px;border-color:#ddd;"/>
			    <ul class="clearfix" style="list-style:none;padding:0 5px;margin:0 0;">
		            <li class="color-switch" style="background-color: #ac1d10"></li>
		            <li class="color-switch" style="background-color: #d82821;"></li>
		            <li class="color-switch default-color" style="background-color: #ef7060;"></li>
		            <li class="color-switch" style="background-color: #fde2d8;"></li>
		            
		            <li class="color-switch" style="background-color: #d32a63;"></li>
		            <li class="color-switch" style="background-color: #eb6794;"></li>
		            <li class="color-switch" style="background-color: #f5bdd1;"></li>            
		            <li class="color-switch" style="background-color: #ffebf0;"></li>
		            
		            <li class="color-switch" style="clear:left;background-color: #e2561b;"></li>
		            <li class="color-switch" style="background-color: #ff8124;"></li>
		            <li class="color-switch" style="background-color: #fcb42b;"></li>
		            <li class="color-switch" style="background-color: #feecaf;"></li>
		            
		            <li class="color-switch" style="clear:left;background-color: #0c8918;"></li>
		            <li class="color-switch" style="background-color: #80b135;"></li>
		            <li class="color-switch" style="background-color:#c2c92a;"></li>
		            <li class="color-switch" style="background-color:#e5f3d0;"></li>
		            
		            <!-- <li class="color-switch" style="clear:left;background-color: #1f877a;"></li>
		            <li class="color-switch" style="background-color: #27abc1;"></li>
		            <li class="color-switch" style="background-color: #5acfe1;"></li>
		            <li class="color-switch" style="background-color: #b6f2ea;"></li> -->
		            
		            <li class="color-switch" style="clear:left;background-color:#374aae;"></li>
		            <li class="color-switch" style="background-color:#1e9be8;"></li>
		            <li class="color-switch" style="background-color:#59c3f9;"></li>
		            <li class="color-switch" style="background-color:#b6e4fd;"></li>
		
		            <li class="color-switch" style="clear:left;background-color:#5b39b4;"></li>
		            <li class="color-switch" style="background-color: #4c6ff3;"></li>
		            <li class="color-switch" style="background-color:#91a8fc;"></li>
		            <li class="color-switch" style="background-color:#d0dafe;"></li>
		            
		            <!-- 紫色 -->
		            <li class="color-switch" style="clear:left;background-color:#8d4bbb;"></li>
		            <li class="color-switch" style="background-color: rgb(166, 91, 203);"></li>
		            <li class="color-switch" style="background-color:#cca4e3;"></li>
		            <li class="color-switch" style="background-color: rgb(190, 119, 99);"></li>
		            
		            <li class="color-switch" data-color="#efefef" style="clear:left;background-color:#3c2822;"></li>
		            <li class="color-switch" style="background-color:#6b4d40;"></li>
		            <li class="color-switch" style="background-color:#9f887f;"></li>
		            <li class="color-switch" style="background-color:#d7ccc8;"></li>
		            
		        	<li class="color-switch" style="background-color: #212122;"></li>
		        	<li class="color-switch" style="background-color: #757576;"></li>
		        	<li class="color-switch" style="background-color: #c6c6c7"></li>
		        	<li class="color-switch" style="background-color: #f5f5f4"></li>
		        	
		        </ul>
		        {{if $current_user_id}}
		        {{/if}}
	</div>        
</section>
